新增頁面的測試

這個與上一個列表頁面的測試非常相似，一樣，依照想要詳細的程度，可以決定要檢查的內容。
我們在這邊檢查該路徑的結果是不是有新增頁面的標題即可。

小測驗：參考上一個 describe "index" 測試，寫一個檢查新增頁面有沒有顯示 "新增感激筆記" 的測試。

參考解答：

describe "顯示新增筆記表格" do
  test "renders form", %{conn: conn} do
    conn = get(conn, ~p"/notes/new")
    assert html_response(conn, 200) =~ "新增感激筆記"
  end
end

新增流程測試

要寫新增流程的測試，我們先列出所有的操作步驟：

1. 送出表格 post 與欲新增內容
2. 確認頁面有沒有轉址到列表頁面
3. 確認頁面有沒有顯示成功訊息
4. 確認新內容有沒有出現在列表頁面

describe "create note" do
  test "新增成功後轉址到列表", %{conn: conn} do
    # 1. 送出表格 post 與欲新增內容
    conn = post(conn, ~p"/notes", note: %{content: "新的筆記內容"})
    # 2. 確認頁面有沒有轉址到列表頁面
    assert redirected_to(conn) == ~p"/notes"

    # 這邊使用同一個 conn 模擬瀏覽器轉址到列表頁面
    conn = get(conn, ~p"/notes/")
    html = html_response(conn, 200)
    # 3. 確認頁面有沒有顯示成功訊息
    assert html =~ "新的感激筆記建立成功"
    # 4. 確認新內容有沒有出現在列表頁面
    assert html =~ "新的筆記內容"
  end
end

測試有預期的錯誤狀況

在上面的測試中，我們假設使用者會正確的輸入內容，但是在實際的應用中，依據情況可能要測試可以預期的錯誤狀況，在這邊是如果沒有輸入內容，會出現錯誤訊息。

test "資料有誤時顯示錯誤", %{conn: conn} do
  conn = post(conn, ~p"/notes", note: %{content: ""})
  html = html_response(conn, 200)
  assert html =~ "新增感激筆記"
  assert html =~ Plug.HTML.html_escape("can't be blank")
end

在這邊我們模擬使用者沒有輸入內容，送出表單後，會回到新增頁面，並且顯示錯誤訊息。
要注意的是，目前的錯誤訊息是不得為空的預設訊息 "can't be blank"，因為內含單引號，在 html 上會變成 can't be blank 導致測試錯誤，所以要用 Plug.HTML.html_escape 轉換成 html 的格式來比較。

未來如果還有盈餘的章節可以提一下修改 Ecto 預設錯誤訊息。